<template>
  <div class="operate">
    <div class="btn">
      <button style="background: #d68b01" @click="rebutShow = true">
        驳回
      </button>
      <button @click="approve" :class="{ grey: isOnlyReject }">审核</button>
    </div>
    <a-modal
      title="驳回"
      v-model="rebutShow"
      centered
      width="560px"
      destroyOnClose
      @ok="rebutSubmit"
    >
      <zh-row>
        <zh-input
          v-model="reason"
          :labelCol="{ span: 0 }"
          :wrapperCol="{ span: 24 }"
          type="textarea"
          placeholder="请输入驳回理由"
          :span="24"
          :rows="6"
        ></zh-input>
      </zh-row>
    </a-modal>
  </div>
</template>

<script>
import { pressToReject, pressToAudit } from "@/services/system/flowPath";
export default {
  props: {
    id: {
      type: [String, Number],
      default: "",
    },
    isOnlyReject: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      reason: "",
      rebutShow: false,
    };
  },
  methods: {
    // 驳回
    rebutSubmit() {
      if (!this.reason) {
        this.$message.error("请输入驳回理由！");
        return;
      }
      this.$http
        .post(pressToReject, {
          e0201: this.id,
          e0310: this.reason,
        })
        .then((res) => {
          if (res.code === 0) {
            this.rebutShow = false;
            this.oprateConfirm("驳回成功！");
          } else {
            this.oprateConfirm(res.message, "error");
          }
        });
    },
    // 确认
    approve() {
      if (this.isOnlyReject) return;
      let _this = this;
      this.$confirm({
        title: `温馨提示`,
        content: `确定审核结束当前隐患点位？`,
        centered: true,
        okText: "确定",
        onOk() {
          _this.insureApprove();
        },
        onCancel() {},
        autoFocusButton: null,
      });
    },
    insureApprove() {
      this.$http
        .post(pressToAudit, {
          e0201: this.id,
        })
        .then((res) => {
          if (res.code === 0) {
            this.oprateConfirm("审核成功！");
          } else {
            this.oprateConfirm(res.message, "error");
          }
        });
    },
    oprateConfirm(message, code = "success") {
      this.$notification[code]({
        message: "提示",
        description: message,
        duration: 4,
      });
      if (code === "success") {
        setTimeout(() => {
          this.$emit("managerModalClose");
        }, 300);
      }
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" scoped>
.operate {
  padding-bottom: 20px;
  .btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 242px;
    margin: 0 auto;
    button {
      flex: 0 0 auto;
      width: 96px;
      height: 36px;
      margin-left: 20px;
      border: none;
      border-radius: 4px;
      box-sizing: border-box;
      background: #156abc;
      text-align: center;
      color: #ffffff;
      outline: none;
      cursor: pointer;
      &.grey {
        background: #ccc;
      }
    }
  }
}
</style>
